<template>
    <div style="background-color: #eee;">
    <van-nav-bar title="个人中心" />
    <div style="margin-bottom: 20px; background-color: #fff;">
        <div style="align-items: center;display: flex; justify-content: flex-end;">
            <img src="../../components/藏狐.png" alt="" style="width: 100px;
        height: 100px;border-radius: 50%;margin: 20px;">
            <h1 style="float: right;margin: 20px;">TopMaker</h1>
        </div>
        <van-grid :column-num="5">
            <van-grid-item icon="photo-o" text="订单" />
            <van-grid-item icon="photo-o" text="付款" />
            <van-grid-item icon="photo-o" text="收货" />
            <van-grid-item icon="photo-o" text="评价" />
            <van-grid-item icon="photo-o" text="售后" />
        </van-grid>
    </div>
    <div style="margin-bottom: 20px; background-color: #fff;">
        <van-field v-model="result" is-link readonly name="picker" label="地址管理" 
            @click="showPicker = true" />
        <van-field v-model="result" is-link readonly name="picker" label="我的优惠卷" 
            @click="showPicker = true" />
        <van-field v-model="result" is-link readonly name="picker" label="优先购买码" 
            @click="showPicker = true" />
    </div>
    <div style="margin-bottom: 20px; background-color: #fff;">
        <van-field v-model="result" is-link readonly name="picker" label="常见问题" 
            @click="showPicker = true" />
        <van-field v-model="result" is-link readonly name="picker" label="服务支持" 
            @click="showPicker = true" />
    </div>
    <div style="margin-bottom: 20px; background-color: #fff;">
        <van-field v-model="result" is-link readonly name="picker" label="意外遂平保修服务" 
            @click="showPicker = true" />
        <van-field v-model="result" is-link readonly name="picker" label="服务支持" 
            @click="showPicker = true" />
    </div>

    </div>

</template>

<script setup>

</script>

<style lang="scss" scoped></style>